<template>
	<view>
		<van-toast id="van-toast" />
		<view class="">
			<van-nav-bar title="发布产品" left-arrow />
		</view>
		<view class="">
			<input v-model="basic" type="text" id="message" placeholder="卖家都关品牌型号、入手渠道、转手原因..." />
		</view>
		<view class="picture">
			<button @click="chooseimg" class="sc">上传</button>
			<image style="width: 80rpx;height: 80rpx;" v-for="(item, index) in msgimg" :key="index" :src="item">
		</view>
		<view class="adds">
			<van-icon name="location-o" /><span @click="diz">请选择发货地址></span>
		</view>
		<view class="">
			<van-dialog use-slot title="输入地址" :show="showName" show-cancel-button @confirm="getUserInfo"
				@cancel="onClose1">
				<view style="display:flex">
					<view style="margin-left: 30rpx;">
						地址
					</view>
					<input v-model="adds" placeholder="请输入发货地址">
				</view>
			</van-dialog>
		</view>
		<view class="xt">
		</view>
		<view class="">
			<input type="text" v-model="mc" placeholder="请输入该商品的型号或名称">
		</view>
		<!-- 	<view class="">
			
		</view>
		 -->
		<!-- 		<view class="xt">
		</view> -->
		<view style="display: flex;justify-content: space-around;">
			<view class="zcm" @click="showPopup">
				正常卖
			</view>
			<view class="pm" @click="paimai">
				拍卖
			</view>
		</view>
		<!--正常买-->
		<view class="">
			<van-popup :show="show1" closeable position="bottom" custom-style="height: 60%" @close="onClose">
				<view class="">
					价格：<input type="number" placeholder="0.00" v-model="number">
					原价：<input type="number" placeholder="0.00" v-model="cost">
					<!-- 加价幅度：<input type="number" placeholder="111"  v-model="raise"> -->

					<van-cell-group>
						<!-- <van-field :value="phone" v-model="Number" label="价格" placeholder="0.00" :error-message="err" :border="true" />
						<van-field :value="ddd" v-model="cost" label="原价" placeholder="0.00" :error-message="err" :border="true" /> -->
						<van-cell title="运费" value="包邮" />
					</van-cell-group>

				</view>
			</van-popup>
		</view>
		<!--拍卖-->
		<view>
			<van-popup :show="show2" closeable position="bottom" custom-style="height: 60%" @close="onClose">
				<view class="">
					起拍价：<input type="number" placeholder="0.00" v-model="starting">
					保证金：<input type="number" placeholder="0.00" v-model="pledge">
					加价幅度：<input type="number" placeholder="0.00" v-model="raise">
				</view>
				<van-cell-group>
					<!-- 	<van-field v-model="starting" label="起拍价" placeholder="0.00" :error-message="err" :border="true" />
					
					<van-field v-model="pledge" label="保证金" placeholder="0.00" :error-message="err" :border="true" />
					<van-field v-model="raise" label="加价幅度" placeholder="0.00" :error-message="err" :border="true" /> -->
					<view class="" style="display: flex;justify-content: space-around;">
						<view class="" @click="kssj1">
							开始时间
						</view>

						<view class="" @click="jssj1">
							结束时间
						</view>
					</view>
				</van-cell-group>


				<view class="" v-show="kssj">
					<input type="datetime-local" v-model="time" class="measureDate" placeholder="请选择日期">
				</view>
				<view class="" v-show="jssj">
					<input type="datetime-local" v-model="endtime" class="measureDate" placeholder="请选择日期">
				</view>
			</van-popup>
		</view>
		<view class="sss">
			<view class="fabu" @click="fabu">
				发布
			</view>
		</view>
	</view>
</template>

<script>
	import Toast from "../../wxcomponents/vant/toast/index";
	import request from '../../com/request.js'
	export default {
		data() {
			return {
				basic: '',
				user: uni.getStorageSync("userTel"),
				show: false,
				show1: false,
				starting: '',

				show2: false,
				showName: false,
				kssj: false,
				jssj: false,
				pledge: '',
				number: '',
				ddd: '',
				cost: '',
				phone: '',
				currentDate: '',
				jsDate: '',
				mc: '',
				time: '',
				endtime: '',
				adds: '',
				elect: '',
				// areaList,
				fileList: [],
				value: '',
				msgimg: [],
			}
		},
		methods: {
			getUserInfo() {
				this.showName = false
			},
			diz() {
				this.showName = true;
			},
			showPopup() {
				this.show1 = true;
				this.show2 = false;
				this.elect = 1;
			},
			onSave(a) {
				//发布地址
				console.log(a, 281);
				this.addslist = a.province + a.city + a.county;
				console.log(this.addslist, 1111111);
				this.show = false;
			},
			onClose() {
				this.show1 = false;
				console.log("取消")
				this.show2 = false;
			},
			onClose1() {
				this.showName = false
				console.log("取消")
			},

			paimai() {
				this.show2 = true;
				this.show1 = false;
				this.elect = 2;
			},
			kssj1() {
				this.kssj = true;
				this.jssj = false;
			},
			jssj1() {
				this.kssj = false;
				this.jssj = true;
			},
			onInput(event) {
				console.log(event.detail)
				this.currentDate = event.detail
			},
			fabu() {
				var that = this
				if ((this.cost == "" || this.number == "" ||this.msgimg=='' ||this.showName) && (this.starting == "" || this.pledge == "" || this.raise ==
						"")) {
					uni.showToast({
						title: '价格&图片&地址&描述不能为空哦',
						duration: 500,
						icon: 'none',
					});

				}else{
					
				request({
					url: 'api/commodityTable/sendissue',
					data: {
						commodityName: this.mc,
						originalPrice: this.cost,
						currentPrice: this.number,
						commodityImg: this.msgimg[0],
						describe: this.basic,
						userTel: this.user,
						imgList2: JSON.stringify(this.msgimg),
						address: this.adds,
						sortid: 1,
						isno: this.elect,
						starting: this.starting,
						auctionstate: 0 + "",
						addPrice: this.raise,
						nowPrice: this.starting,
						startTime: this.time,
						endTime: this.endtime,
						bail: this.pledge,
					},
					method: "POST",
					dataType: 'json',
					success: function(resp) {
						console.log(resp)
						that.msgimg = [];
						that.mc = '';
						that.cost = '';
						that.number = '';
						that.basic = '';
						that.sortid = '';
						that.elect = '';
						that.starting = '';
						that.pledge = '';
						console.log(that.cost)
					},
				})
				}
			},
			chooseimg() {
				console.log(1111)
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album'], //这要注意，camera掉拍照，album是打开手机相册
					success: (res) => {

						let tempFilePaths = res.tempFilePaths;
						// console.log(tempFilePaths[0]);
						uni.uploadFile({
							url: 'http://localhost:8000/api/common/uploadfile', //仅为示例，非真实的接口地址
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {
								'file': tempFilePaths[0]
							},
							success: (uploadFileRes) => {
								console.log(JSON.parse(uploadFileRes.data).data);
								// this.msgimg = JSON.parse(uploadFileRes.data).data
								this.msgimg.push(JSON.parse(uploadFileRes.data).data)
								console.log(this.msgimg, 75);
								// this.sendMsg()
							}
						});

					}
				});
			},
		}
	}
</script>

<style>
	* {
		font-size: 12px;
		padding: 0;
		margin: 0;
		text-decoration: none;
		list-style: none;
	}

	#message {
		width: 1276px;
		height: 50px;
		border: 0px;
		font-size: 12px;
	}

	.picture {
		margin-top: 15px;
	}

	.adds {
		width: 110px;
		background-color: darkgray;
		border-radius: 10px;
		font-size: 12px;
	}

	.xt {
		margin-top: 10rpx;
		border: 0.5px solid #A9A9A9;
	}

	.zcm {
		background-color: #A9A9A9;
		width: 120rpx;
		height: 50rpx;
		border-radius: 15px;
		text-align: center;
		line-height: 50rpx;
		color: white;
		font-size: 25rpx;
	}

	.pm {
		background-color: #A9A9A9;
		width: 120rpx;
		height: 50rpx;
		border-radius: 15px;
		text-align: center;
		color: white;
		font-size: 25rpx;
		line-height: 50rpx;
	}

	.fabu {
		width: 150rpx;
		height: 100rpx;
		background-color: coral;
		line-height: 100rpx;
		border-radius: 30px;
		text-align: center;

	}

	.sss {
		width: 700rpx;
		height: 300rpx;
		display: flex;
		justify-content: flex-end;
		margin-top: 200px;
	}

	.sc {
		width: 200rpx;
		height: 50rpx;
		font-size: 20rpx;
		/* color: white; */
		background-color: yellow;
	}
</style>
